<template>
  <div>
    vue-websocket
  </div>
</template>
<script>
import { nanoid } from "nanoid";

export default {
  data() {
    return {};
  },
  mounted() {
    this.initWebSocket();
  },
  methods: {
    //发送聊天信息
    sendText() {
      let _this = this;
      _this.ws.send(JSON.stringify(params)); //调用WebSocket send()发送信息的方法
    },
    //进入页面创建websocket连接
    initWebSocket() {
      let randomId = nanoid();
      let _this = this;
      //判断页面有没有存在websocket连接
      if (window.WebSocket) {
        // 192.168.0.115 是我本地IP地址 此处的 :8081 端口号 要与后端配置的一致
        let ws = new WebSocket(
          `${window.SITE_CONFIG["wsURL"]}/ws/${randomId.slice(0, 2)}`
        );
        _this.ws = ws;
        ws.onopen = function(e) {
          console.log("服务器连接成功");
        };
        ws.onclose = function(e) {
          console.log("服务器连接关闭");
        };
        ws.onerror = function() {
          console.log("服务器连接出错");
        };
        ws.onmessage = function(e) {
          //接收服务器返回的数据
          console.log("接收服务器返回的数据:e", e);
        };
      }
    },
  },
};
</script>
<style>
.mod-home {
  line-height: 1.5;
}
</style>
